<template>
    <el-dialog v-model="props.visible" title="Tips" width="30%" :before-close="onCancel">
        <span>This is a message</span>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="onCancel">Cancel</el-button>
                <el-button type="primary" @click="onConfirm ">
                    Confirm
                </el-button>
            </span>
        </template>
    </el-dialog>
</template>

<script setup lang="ts">
import { reactive, toRefs, ref, defineProps, withDefaults,defineEmits } from "vue";
let emits = defineEmits<{
    (event:'cancel'):void,
    (event:'confirm'):void,

}>()
let props = withDefaults(
    defineProps<{
        visible: boolean
    }>(), {
    visible: false
})

let onCancel  =()=>{
    emits('cancel')
 }
let onConfirm  =()=>{
    emits('confirm')
 }
let menuEditData = ref(true)
let editCancel = () => {
    console.log("close")
}
</script>

<style lang="scss" scoped></style>